<%@ page language="java" contentType="text/html; charset=UTF-8"
	pageEncoding="UTF-8"%>
<%@ include file="/common/tablibs.jsp"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>${title}</title>
<script type="text/javascript"
	src="${ctx }/public/js/jquery-1.9.0.min.js"></script>
<link href="${ctx }/public/css/login2.css" rel="stylesheet"
	type="text/css" />
</head>
<body>
	<h1>${title }<sup>2018</sup>
	</h1>
	<div class="login" style="margin-top: 50px;">
		<div class="header">
			<div class="switch" id="switch">
				<a class="switch_btn_focus" id="switch_qlogin"
					href="javascript:void(0);" tabindex="7">快速登录</a> <a
					class="switch_btn" id="switch_login" href="javascript:void(0);"
					tabindex="8">快速注册</a>
				<div class="switch_bottom" id="switch_bottom"
					style="position: absolute; width: 64px; left: 0px;"></div>
			</div>
		</div>
		<div class="web_qr_login" id="web_qr_login"
			style="display: block; height: 300px;"> 
			<div class="web_login" id="web_login">
				<div class="login-box">
					<div class="login_form">
						<form  action="${ctx }/login" name="loginform" accept-charset="utf-8"
							id="login_form" class="loginForm" method="post">
							<input type="hidden" name="did" value="0" />
							<div class="uinArea" id="uinArea">
								<label class="input-tips" for="u">帐号：</label>
								<div class="inputOuter" id="uArea">
									<input type="text" id="u" name="username" class="inputstyle" />
								</div>
							</div>
							<div class="pwdArea" id="pwdArea">
								<label class="input-tips" for="p">密码：</label>
								<div class="inputOuter" id="pArea">
									<input type="password" id="p" name="password" class="inputstyle" />
								</div>
							</div>
							<div class="uinArea" id="">
								<input id="type" style="width: 15px" type="radio" value="0" name="type">
								<span style="font-size: 20px">老师 </span>
								<input id="type" style="width: 15px"  type="radio" value="1" name="type">
								<span style="font-size: 20px">学生 </span>
							</div>
							<div style="font-size: 15px;color: red;" align="center">
								${obj.msg }
							</div>
							<div style="padding-left: 50px; margin-top: 20px;">
								<input type="button" value="登 录" style="width: 150px;"
									class="button_blue" onclick="login()" />
							</div>
						</form>
					</div>
				</div>
			</div>
		</div>
		<div class="qlogin" id="qlogin" style="display: none;">
			<div class="web_login">
				<ul class="reg_form" id="reg-ul">
					<li><label for="user" class="input-tips2">用户名：</label>
						<div class="inputOuter2">
							<input type="text" id="user" name="user" maxlength="16"
								class="inputstyle2" />
						</div></li>
					<li><label for="passwd" class="input-tips2">密码：</label>
						<div class="inputOuter2">
							<input type="password" id="passwd" name="passwd" maxlength="16"
								class="inputstyle2" />
						</div></li>
					<li><label for="passwd2" class="input-tips2">确认密码：</label>
						<div class="inputOuter2">
							<input type="password" id="passwd2" name="" maxlength="16"
								class="inputstyle2" />
						</div></li>
					<li><label for="name" class="input-tips2">姓名：</label>
						<div class="inputOuter2">
							<input type="text" id="name1" name="name1" maxlength="16"
								class="inputstyle2" />
						</div></li>
					<li>
					<li><label for="type" class="input-tips2">类型：</label>
						<div class="inputOuter2">

							<input id="type" style="width: 15px" type="radio" value="0" name="type1">
							<span style="font-size: 20px">老师 </span>
							<input id="type" style="width: 15px"  type="radio" value="1" name="type1">
							<span style="font-size: 20px">学生 </span>
						</div></li>
					<li>
						<div style="padding-left: 50px;">
							<input type="button" id="reg"
								style="margin-top: 10px; width: 150px;" class="button_blue"
								value="注册" onclick="reg()" />
						</div>

					</li>
				</ul>
			</div>
		</div>
	</div>
</body>
<script type="text/javascript">
	//页面初始化
	$(function() {

		$('#switch_qlogin').click(
				function() {
					$('#switch_login').removeClass("switch_btn_focus")
							.addClass('switch_btn');
					$('#switch_qlogin').removeClass("switch_btn").addClass(
							'switch_btn_focus');
					$('#switch_bottom').animate({
						left : '0px',
						width : '70px'
					});
					$('#qlogin').css('display', 'none');
					$('#web_qr_login').css('display', 'block');

				});
		$('#switch_login').click(
				function() {

					$('#switch_login').removeClass("switch_btn").addClass(
							'switch_btn_focus');
					$('#switch_qlogin').removeClass("switch_btn_focus")
							.addClass('switch_btn');
					$('#switch_bottom').animate({
						left : '154px',
						width : '70px'
					});

					$('#qlogin').css('display', 'block');
					$('#web_qr_login').css('display', 'none');
				});
		if (getParam("a") == '0') {
			$('#switch_login').trigger('click');
		}

	});
	//注册
	function reg(){
		var user = $('#user').val();
		var name = $('#name1').val();
		var passwd = $('#passwd').val();
		var passwd2 = $('#passwd2').val();
		var type = $('input[name="type1"]:checked').val();
		if(name==''){
			alert('姓名不能为空！');
			return ;
		}
		if(user==''){
			alert('账号不能为空！');
			return ;
		}
		if(passwd==''){
			alert('密码不能为空！');
			return ;
		}
		if(passwd2==''){
			alert('确认密码不能为空！');
			return ;
		}
		if(passwd2!=passwd){
			alert('两次输入密码不同！');
			return ;
		}
		if(type==null){
			alert('请选择类型！');
			return ;
		}
		//ajax方式将注册信息提交到/reg上
		$.post("${ctx}/reg",{
			username:user,
			password:passwd,
			name:name,
			type:type
		},function(data){
			//返回的data 1表示成功，0表示用户名已存在
			if(data=='1'){//成功刷新页面 否则提示
				alert("注册成功！");
				location.reload();
			}else{
				alert("用户名已存在！");
			}
		});
	}
	//登录
	function login(){
		if($('#u').val()==''){
			alert("账号不能为空！");
			return;
		}
		if($('#p').val()==''){
			alert("密码不能为空！");
			return;
		}
		if($('input[name="type"]:checked').val()==null){
			alert("请选择类型！");
			return ;
		}
		$('#login_form').submit();
	}
</script>
</html>